// ==UserScript==
// @name         语雀增强
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  语雀增强
// @author       shxzz
// @match        https://*.yuque.com/*
// @grant        GM_addStyle
// @grant        GM_registerMenuCommand
// @grant        GM_getValue
// @grant        GM_setValue
// ==/UserScript==

(function() {
    'use strict';

    // 添加样式
    const quickLinkButtonStyles = `
        .yq-quick-link-button {
            position: fixed;
            width: 42px;
            height: 42px;
            display: flex;
            right: 24px;
            bottom: 248px;
            justify-content: space-around;
            align-items: center;
            border-radius: 50%;
            box-shadow: 0 1px 4px -2px rgba(0,0,0,.13),0 2px 8px 0 rgba(0,0,0,.08),0 8px 16px 4px rgba(0,0,0,.04);
            color: var(--yq-text-body);
            cursor: pointer;
            z-index: 997;
            background: var(--yq-bg-secondary);
            transition: background-color 0.2s;
        }

        .yq-quick-link-button:hover {
            background: var(--yq-yuque-grey-4);
        }
    `;

    const quickMenuStyles = `
        .yq-quick-menu {
            position: fixed;
            right: 80px;
            bottom: 248px;
            background: var(--yq-bg-secondary);
            border-radius: 4px;
            padding: 8px 0;
            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
            z-index: 998;
            display: none;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.2s, visibility 0.2s;
        }

        .yq-quick-menu.show {
            display: block;
            opacity: 1;
            visibility: visible;
        }

        .yq-quick-menu a {
            display: block;
            padding: 8px 16px;
            color: var(--yq-text-body);
            text-decoration: none;
            font-size: 14px;
            transition: all 0.2s;
        }

        .yq-quick-menu a:hover {
            background: var(--yq-yuque-grey-4);
            color: var(--yq-text-primary);
        }
    `;

    const styles = quickLinkButtonStyles + quickMenuStyles;

    const styleSheet = document.createElement('style');
    styleSheet.textContent = styles;
    document.head.appendChild(styleSheet);

    // 移除之前的设置相关样式，改为独立的样式
    const settingsStyles = `
        .yq-settings-modal {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: var(--yq-bg-secondary);
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
            z-index: 999;
            min-width: 400px;
        }

        .yq-modal-backdrop {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.5);
            z-index: 998;
        }

        .yq-link-item {
            display: flex;
            margin-bottom: 10px;
            gap: 8px;
        }

        .yq-link-item input {
            padding: 4px 8px;
            border: 1px solid var(--yq-yuque-grey-4);
            border-radius: 4px;
        }

        .yq-settings-buttons {
            margin-top: 16px;
            display: flex;
            justify-content: flex-end;
            gap: 8px;
        }

        .yq-settings-buttons button {
            padding: 4px 12px;
            border-radius: 4px;
            border: 1px solid var(--yq-yuque-grey-4);
            background: var(--yq-bg-secondary);
            cursor: pointer;
        }

        .yq-settings-buttons button:hover {
            background: var(--yq-yuque-grey-4);
        }

        .yq-add-link {
            margin-top: 12px;
        }
    `;

    // 创建管理链接的弹窗
    function createSettingsModal() {
        const modalBackdrop = document.createElement('div');
        modalBackdrop.className = 'yq-modal-backdrop';
        
        const settingsModal = document.createElement('div');
        settingsModal.className = 'yq-settings-modal';
        settingsModal.innerHTML = `
            <h3 style="margin-bottom: 16px">管理快捷链接</h3>
            <div class="yq-links-container"></div>
            <button class="yq-add-link">添加链接</button>
            <div class="yq-settings-buttons">
                <button class="yq-cancel">取消</button>
                <button class="yq-save">保存</button>
            </div>
        `;

        document.body.appendChild(modalBackdrop);
        document.body.appendChild(settingsModal);

        const styleSheet = document.createElement('style');
        styleSheet.textContent = settingsStyles;
        document.head.appendChild(styleSheet);

        return { modalBackdrop, settingsModal };
    }

    // 显示设置弹窗
    function showSettingsDialog() {
        const { modalBackdrop, settingsModal } = createSettingsModal();
        const links = GM_getValue('yq-quick-links', [
            { text: '开始', url: '/dashboard' },
            { text: '知识库', url: '/dashboard/books' },
            { text: '小记', url: '/dashboard/notes' }
        ]);

        function createLinkItem(link = { text: '', url: '' }) {
            const linkItem = document.createElement('div');
            linkItem.className = 'yq-link-item';
            linkItem.innerHTML = `
                <input type="text" placeholder="链接文本" value="${link.text}" class="link-text">
                <input type="text" placeholder="链接地址" value="${link.url}" class="link-url">
                <button class="yq-delete-btn">删除</button>
            `;
            
            // 绑定删除按钮事件
            const deleteBtn = linkItem.querySelector('.yq-delete-btn');
            deleteBtn.addEventListener('click', () => {
                linkItem.remove();
            });
            
            return linkItem;
        }

        function renderLinks() {
            const container = settingsModal.querySelector('.yq-links-container');
            container.innerHTML = '';
            
            links.forEach(link => {
                container.appendChild(createLinkItem(link));
            });
        }

        renderLinks();

        // 绑定添加链接事件
        settingsModal.querySelector('.yq-add-link').addEventListener('click', () => {
            const container = settingsModal.querySelector('.yq-links-container');
            container.appendChild(createLinkItem());
        });

        settingsModal.querySelector('.yq-cancel').addEventListener('click', () => {
            modalBackdrop.remove();
            settingsModal.remove();
        });

        settingsModal.querySelector('.yq-save').addEventListener('click', () => {
            const linkItems = settingsModal.querySelectorAll('.yq-link-item');
            const newLinks = Array.from(linkItems).map(item => ({
                text: item.querySelector('.link-text').value,
                url: item.querySelector('.link-url').value
            })).filter(link => link.text && link.url);

            GM_setValue('yq-quick-links', newLinks);
            modalBackdrop.remove();
            settingsModal.remove();
            location.reload(); // 刷新页面以应用新的链接
        });

        modalBackdrop.addEventListener('click', () => {
            modalBackdrop.remove();
            settingsModal.remove();
        });

        settingsModal.addEventListener('click', (e) => {
            e.stopPropagation();
        });
    }

    // 注册油猴菜单
    GM_registerMenuCommand('管理快捷链接', showSettingsDialog);

    // 创建快捷链接按钮和菜单
    function createQuickLinkButton() {
        const container = document.createElement('div');
        container.className = 'yq-quick-link-button';
        
        // 添加图标
        container.innerHTML = `
            <svg viewBox="0 0 24 24" width="20" height="20">
                <path fill="currentColor" d="M13.5 2C13.5 2.27614 13.2761 2.5 13 2.5L11 2.5C10.7239 2.5 10.5 2.27614 10.5 2C10.5 1.72386 10.7239 1.5 11 1.5L13 1.5C13.2761 1.5 13.5 1.72386 13.5 2ZM13.5 22C13.5 22.2761 13.2761 22.5 13 22.5L11 22.5C10.7239 22.5 10.5 22.2761 10.5 22C10.5 21.7239 10.7239 21.5 11 21.5L13 21.5C13.2761 21.5 13.5 21.7239 13.5 22ZM22 13.5C22.2761 13.5 22.5 13.2761 22.5 13L22.5 11C22.5 10.7239 22.2761 10.5 22 10.5C21.7239 10.5 21.5 10.7239 21.5 11L21.5 13C21.5 13.2761 21.7239 13.5 22 13.5ZM2 13.5C2.27614 13.5 2.5 13.2761 2.5 13L2.5 11C2.5 10.7239 2.27614 10.5 2 10.5C1.72386 10.5 1.5 10.7239 1.5 11L1.5 13C1.5 13.2761 1.72386 13.5 2 13.5Z"/>
            </svg>
        `;

        // 创建菜单
        const menu = document.createElement('div');
        menu.className = 'yq-quick-menu';

        // 获取链接
        const links = GM_getValue('yq-quick-links', [
            { text: '开始', url: '/dashboard' },
            { text: '知识库', url: '/dashboard/books' },
            { text: '小记', url: '/dashboard/notes' }
        ]);

        links.forEach(link => {
            const item = document.createElement('a');
            item.href = link.url;
            item.textContent = link.text;
            menu.appendChild(item);
        });

        container.appendChild(menu);
        document.body.appendChild(container);

        // 处理菜单显示位置
        function adjustMenuPosition() {
            const buttonRect = container.getBoundingClientRect();
            const menuRect = menu.getBoundingClientRect();
            
            // 检查是否有足够的垂直空间
            if (buttonRect.top < menuRect.height) {
                menu.style.bottom = 'auto';
                menu.style.top = '0';
            }
        }

        // 监听窗口大小变化
        window.addEventListener('resize', adjustMenuPosition);
        
        // 初始调整位置
        setTimeout(adjustMenuPosition, 100);

        // 添加新的事件处理代码
        let timeoutId;

        container.addEventListener('mouseenter', () => {
            clearTimeout(timeoutId);
            menu.classList.add('show');
        });

        container.addEventListener('mouseleave', (e) => {
            timeoutId = setTimeout(() => {
                if (!menu.matches(':hover')) {
                    menu.classList.remove('show');
                }
            }, 100);
        });

        menu.addEventListener('mouseenter', () => {
            clearTimeout(timeoutId);
        });

        menu.addEventListener('mouseleave', () => {
            menu.classList.remove('show');
        });
    }

    // 等待页面加载完成后执行
    if (document.readyState === 'loading') {
        window.addEventListener('DOMContentLoaded', createQuickLinkButton);
    } else {
        createQuickLinkButton();
    }
})();
  